<template>
    <uni-popup ref="messagebox" :mask-click="true">
        <view class="dialog_body">
            <view class="close_box">
                <image :src="getImgOssUrl('/ui-prod-2.0.0/cancel_1.1.png')" class="close_btn" @click="closePopup" />
            </view>
            <view class="dialog_content">
                <view class="content">{{ props.content }}</view>
            </view>
            <view class="dialog_footer">
                <view class="btn" @click="emit('comfirm')">{{ btnName }}</view>
            </view>
        </view>
    </uni-popup>
</template>

<script setup>
import { ref } from 'vue';
import { getImgOssUrl } from '@/commons/utils';

const messagebox = ref();

const props = defineProps({
    content: {
        type: String,
        default: '网络错误，请稍后重试~'
    },
    btnName: {
        type: String,
        default: '关闭'
    }
});

const emit = defineEmits(['comfirm']);

const openPopup = () => {
    messagebox?.value?.open();
};

const closePopup = () => {
    messagebox?.value?.close();
};

defineExpose({
    openPopup,
    closePopup
});
</script>

<style lang="scss" scoped src="./index.scss"></style>
